<!DOCTYPE html>
<html xmlns:th="http://www.thymeleaf.org">
<head>

    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">

    <title>I考生列表</title>

    <link href="css/bootstrap.min.css" rel="stylesheet">
    <link href="font-awesome/css/font-awesome.css" rel="stylesheet">
<!--    <link href="css/plugins/dataTables/datatables.min.css" rel="stylesheet">-->
    <link href="css/animate.css" rel="stylesheet">
    <link href="css/style.css" rel="stylesheet">

</head>

<body>

<div id="wrapper">

    <!--引入公共页面-->
    <div th:replace="common/sidebar::sidebar(activeUri='examee-list')"></div>
    <!--当前用户的账户信息-->
    <input type="hidden" id="current_user" th:value="${session.userAccount}">

    <div id="page-wrapper" class="gray-bg">
        <!--招聘进度-->
        <div th:insert="common/interview-process::interview-process" class="wrapper wrapper-content animated fadeInRight">
        </div>
        <!--打分进度-->
        <div th:insert="common/mark-process::mark-process" class="wrapper wrapper-content animated fadeInRight">
        </div>

        <div class="wrapper wrapper-content animated fadeInRight">
            <div class="row">
                <div class="col-lg-12">
                    <div class="ibox ">
                        <div class="ibox-title">
                            <div class="row">
                                <div class="col-5"><h5 >当前面试考生赋分</h5></div>
                                <div class="col-7">
                                    <h5 >总分：</h5><span class="label label-danger" style="font-size: large">00.000</span>
                                </div>
                            </div>
                            <div class="ibox-tools">
                                <a class="collapse-link">
                                    <i class="fa fa-chevron-up"></i>
                                </a>
                                <a class="dropdown-toggle" data-toggle="dropdown" href="#">
                                    <i class="fa fa-wrench"></i>
                                </a>
                            </div>
                        </div>
                        <div class="ibox-content">

                            <table class="table table-bordered" id="table_scorePage">
                                <thead>
                                <tr>
                                    <th>面试要素</th>
                                    <th>满分</th>
                                    <th>优</th>
                                    <th>良</th>
                                    <th>中</th>
                                    <th>差</th>
                                    <th>得分</th>
                                    <th>操作</th>
                                </tr>
                                </thead>
                                <tbody>
                                </tbody>
                                <tfoot>
                                </tfoot>
                            </table>
                        </div>
                    </div>
                </div>

            </div>
        </div>
        <div class="footer">
            <div class="pull-right">
                10GB of <strong>250GB</strong> Free.
            </div>
            <div>
                <strong>Copyright</strong> Example Company &copy; 2014-2018
            </div>
        </div>

    </div>
</div>

<!--Mainly scripts-->
<script type="text/javascript" th:src="@{js/jquery-3.1.1.min.js}"></script>
<script type="text/javascript" th:src="@{js/popper.min.js}"></script>
<script type="text/javascript" th:src="@{js/bootstrap.min.js}"></script>
<script type="text/javascript" th:src="@{js/plugins/metisMenu/jquery.metisMenu.js}"></script>
<script type="text/javascript" th:src="@{js/plugins/slimscroll/jquery.slimscroll.min.js}"></script>

<script type="text/javascript" th:src="@{js/plugins/dataTables/datatables.min.js}"></script>
<script type="text/javascript" th:src="@{js/plugins/dataTables/dataTables.bootstrap4.min.js}"></script>

<!-- Custom and plugin javascript -->
<script type="text/javascript" th:src="@{js/inspinia.js}"></script>
<script type="text/javascript" th:src="@{js/plugins/pace/pace.min.js}"></script>

<!-- Page-Level Scripts -->
<script>
    $(document).ready(function() {
        getScoreElementDetails()
    });

    //获取评分要素
    function getScoreElementDetails() {
        var table_scorePage= $("#table_scorePage").DataTable({
            responsive: true,
            bFilter: false,
            bLengthChange: false,
            ajax:{
                url:"/supervisor/getScoreElementDetails",
                type:"POST",
                dataSrc:function (result) {
                    return result.data;
                }
            },
            bAutoWidth: true,
            columns: [
                { data: 'name' },
                { data: 'fullScore' },
                { data: 'excellentScore' },
                { data: 'goodScore' },
                { data: 'mediumScore' },
                { data: 'poorScore' },
                { data: null,"render":function (data,type,row,meta) {
                        var scoreEleId = '"' + row.id + '"';
                        var fullScore='"' + row.fullScore + '"'
                        return "<input type='number' class='form-control' placeholder='输入1-满分间的分数' id='input_'  onblur='validateInputScore("+scoreEleId+","+fullScore+",this)'>"
                    } },
                {"data":null,"render":function (data,type,row,meta) {
                        var scoreEleId = '"' + row.id + '"';
                        return "<button type='button' class='btn btn-warning btn-sm' onclick='save("+scoreEleId+")'>暂存</button>"
                               +"  "
                               +"<button type='button' class='btn btn-dark btn-sm' onclick='modify("+scoreEleId+")'>修改</button>"
                                +"  "
                                +"<button type='button' class='btn btn-success btn-sm' onclick='submit("+scoreEleId+")'>提交</button>";
                    }}
            ]
        });
    }

    function validateInputScore(scoreEleId,fullScore,element) {
        //获取当前数值
        var inputVal =parseFloat(element.value);
        if (inputVal>parseFloat(fullScore)||inputVal<0){
            alert("输入数据有误");
            element.value="";
        }
    }


</script>
</body>

</html>
